<!DOCTYPE html>
<html>
<head>
    <title>活动详情</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

    <meta name="description" content="">

    <link rel="stylesheet" href="dist/lib/weui.css">
    <link rel="stylesheet" href="dist/css/build.css">
    <link rel="stylesheet" href="dist/lib/imgUp.css">
    <link rel="stylesheet" href="dist/css/jquery-weui.css">

    <style>
        body {
            background: #f5f5f5
        }

        .weui-pull-to-refresh {
            margin-top: -35px;
        }

        .weui-article {
            background: #fff;
            padding-bottom: 2px;
            margin-bottom: 15px;
            border-bottom: 1px solid #EDEDED;
            /*-moz-box-shadow: 2px 2px 5px #eee;*/
            /*-webkit-box-shadow: 0px 2px 5px #eee;*/
            /*box-shadow: 0px 2px 5px #eee;*/
        }

        .weui-article h1 {
            font-size: 22px;
            line-height: 28px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            margin-bottom: 15px;

        }

        .top span {
            /*color: #417DFF;*/
            color: #888;
        }

        .top span.data {
            padding-left: 12px;
            color: #888;
        }

        .cont {
            padding-top: 15px;
            font-size: 17px;
            color: #333;
            line-height: 30px;
        }

        .cont.list {
            padding-top: 10px;
            color: #666;
        }

        .top_ul {

        }

        .padding-top0 {
            padding-top: 0px;
        }

        .padding-bottom10 {
            padding-bottom: 10px;
        }

        .weui-footer_fixed-bottom {
            bottom: 0px;
        }

        .lsbutton {
            border-radius: 0px;
            display: inline-block;
            width: 50%;
            float: left;
            position: relative;
            margin-left: auto;
            margin-right: auto;
            padding-left: 14px;
            padding-right: 14px;
            box-sizing: border-box;
            font-size: 18px;
            text-align: center;
            text-decoration: none;
            color: #FFFFFF;
            line-height: 2.55555556;
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            overflow: hidden;
            background: #007aff;
        }

        .lsbutton.two {
            background: #ffffff;
            color: #007aff;
        }
    </style>
</head>

<body>
<div id="list">
    <div class="" v-for="item in items">
        <article class="weui-article">
            <div class="top">
                <h1>{{item.title}}</h1>
                <ul class="top_ul">
                    <li>
                        <span>活动时间</span><span class="data">{{item.beginDate}} ~ {{item.endDate}}</span>
                    </li>
                    <li>
                        <span>活动地点</span><span class="data">{{item.locale}}</span>
                    </li>
                    <li>
                        <span>举办支部</span><span class="data">{{item.departmentName}}</span>
                    </li>
                </ul>
            </div>

            <div class="cont">
                活动内容
            </div>
            <div class="cont list" v-if=" item.photoFrontConverUrl =='' ">

                <p>{{item.comment}}</p>

            </div>

            <div class="cont" v-else>
                <img :src="item.photoFrontConverUrl">
                <p>{{item.comment}}</p>
            </div>

        </article>

        <div class="" v-if=" item.photoAchievementUrl == '' || item.photoAchievementUrl == null "></div>
        <div class="" v-else>
            <article class="weui-article padding-bottom10">
                <div class="cont padding-top0">
                    活动图片
                </div>
                <div class="img" id="imgAr" v-html="item.photoAchievementUrl">
                    <!--{{dateUtils.imgArr(item.photoAchievementUrl)}}-->
                    <!--<img :src="item.photoAchievementUrl">-->
                </div>
            </article>
        </div>

        <div class="" v-if=" item.impression == null "></div>
        <div class="" v-else>
            <article class="weui-article padding-bottom10">
                <div class="cont padding-top0">
                    活动心得
                </div>
                <div class="cont list">

                    <p>{{item.impression}}</p>

                </div>
            </article>
        </div>

        <div class="" v-if=" item.remark == null "></div>
        <div class="" v-else>
            <article class="weui-article padding-bottom10">
                <div class="cont padding-top0">
                    活动信息
                </div>
                <div class="cont list">

                    <p>{{item.remark}}</p>

                </div>
            </article>
        </div>

        <!--底部按钮-->
        <div class="weui-footer weui-footer_fixed-bottom">
            <button class="lsbutton two" @click="openResult(item.wechatId,item.id,item.title)">录入成果</button>
            <button class="lsbutton" id="wybm" @click="getEnlist(item.departmentId)">我要报名</button>

        </div>

    </div>
</div>


<script src="dist/lib/jquery-2.1.4.js"></script>
<script src="dist/lib/fastclick.js"></script>
<script>
    $(function () {
        FastClick.attach(document.body);
    });

</script>
<script src="dist/js/jquery-weui.js"></script>
<script src="dist/lib/vue.min.js"></script>
<script src="dist/lib/http.js?v1"></script>
<script src="dist/lib/jquery.cookie.js"></script>

<script>

    /**
     * js获取HTML ？后面传值
     */
    function GetRequest() {
        var url = location.search; //获取url中"?"符后的字串
        var theRequest = new Object();
        if (url.indexOf("?") != -1) {
            var str = url.substr(1);
            strs = str.split("&");
            for (var i = 0; i < strs.length; i++) {
                // theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
                theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
            }
        }
        return theRequest;
    }

    /**
     * js获取HTML ？后面传值 的调用方法
     */
    var Request = new Object();
    Request = GetRequest();
    var id;
    id = Request['id'];

    $(document).attr("title", Request['title']);

    /**
     * 登录信息判断
     */
    $http.getUserSignIn(true, 'activity_details.html', 'id=' + id);
    console.log($http.getUserSignIn());


    var news = new Vue({
        el: '#list',
        data: {
            items: [] //列表信息流数据
        }
    });

    getData(id);

    /**
     * 得到活动详情数据
     * @param id
     */
    function getData(id) {
        $http.post($http.getFindByCondition(id)).then(function (data) {
            console.log(id)
            var myData = {
                id: data.data[0].id,
                title: data.data[0].title,
                beginDate: dateUtils.formatDate(data.data[0].beginDate, 'YY-MM-DD'),
                endDate: dateUtils.formatDate(data.data[0].endDate, 'YY-MM-DD'),
                locale: data.data[0].locale,
                photoFrontConverUrl: data.data[0].photoFrontConverUrl,
                comment: data.data[0].comment,
                impression: data.data[0].impression,
                photoAchievementUrl: dateUtils.imgArr(data.data[0].photoAchievementUrl),
                remark: data.data[0].remark,
                departmentId: data.data[0].departmentId,
                departmentName: data.data[0].departmentName,
                wechatId: data.data[0].wechatId

            };

            news.items = news.items.concat(myData);
            // console.log(dateUtils.format(data.data[0].beginDate))
            // news.items = news.items.concat(data['data'][0]);
        }, function (err) {
            console.log(err);
            return err;
        });
    }

    $(document).on("click", "#wybm", function () {

    });

    /**
     * 活动报名
     * @param departmentId
     */
    function getEnlist(departmentId) {
        let deID = $http.getUserSignIn().departmentId;
        let phone = $http.getUserSignIn().wechatId;
        if (departmentId !== deID) {
            $.alert('该活动支部不隶属于你的支部，不允许参加', '警告');
        } else {
            $http.post($http.postEnroll(id, phone)).then(function (data) {
                // console.log(')()()(~~~~~' + data)
                if (data.success === true) {
                    $.alert('报名成功，我们将马上与您联系', '提示')
                } else if (data.success === false) {
                    $.alert(data.message, '提示')
                }
            }, function (err) {

            });
        }
    }

    /**
     * 录入成果
     * @param wechatId
     * @param activityID
     * @param title
     */
    function openResult(wechatId, activityID, title) {
        let mywechatId = $http.getUserSignIn().wechatId;
        if (wechatId !== mywechatId) {
            $.alert('该活动的发布者不是您本人，不能录入成果', '警告');
        } else {
            $.cookie('resultID', $http.getCookieArray(activityID, title));
            // window.location.href = 'activity_result.html';
            window.location.href = 'activity_result.html?id=' + activityID + '&title=' + title+'&wechatId='+wechatId;
        }
    }
</script>
</body>
</html>
